<script setup lang="ts">
import { watch, ref, reactive } from 'vue';
import { useFeishuStore } from '@/stores/feishu'

const feishuStore = useFeishuStore();
const show = ref(false); //是否显示登录弹窗
const authorizeForm = reactive({
  appId: '', // 登录账号
  appSecret: '' // 登录密码
})


// 登录提交
function onSubmit(): void {
return ;
}


// 监听器
watch(() => feishuStore.accessToken, (newVal) => {
    show.value = !newVal;
}, { deep: true, immediate: true })

</script>
<template>
  <el-dialog v-model="show" title="飞书授权" :show-confirm-button="false" width="400px" :close-on-click-modal="false" :close-on-press-escape="false">
    <el-form :model="authorizeForm" label-width="0" @submit="onSubmit">
      <el-form-item prop="username" :rules="[{ required: true, message: '请填写应用的 App ID' }]">
        <el-input v-model="authorizeForm.appId" placeholder="App ID"  />
      </el-form-item>
      <el-form-item prop="appSecret" :rules="[{ required: true, message: '请填写应用的 App Secret' }]">
        <el-input
          v-model="authorizeForm.appSecret"
          type="password"
          placeholder="App Secret"
        />
      </el-form-item>
      <el-form-item >
        <el-button style="width: 100%;" type="primary">授权</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>

<style scoped lang="scss">
</style>
